<template>
	<view class="content reg-page">
		<view class="column">
			<view class="r-top">
        <view class="title">职位描述</view>
        <view class="des">
          请勿填写QQ、微信、电话联系方式及特殊符号、性别歧视词、违反劳动法相关内容，否则有可能会导致您的账号被封禁。
        </view>
				<textarea :style="{height:height+'px'}" :adjust-position="false" :maxlength="len" placeholder-style="color:rgba(153,153,153,1);" v-model="content" :placeholder="placeholder" />
				<view class="r-top-t">
				 	<view></view>
					<view> {{contentLength}}/{{len}}</view>
				 </view>
			</view>
		</view>
		<!-- <view class="btn-row"><button type="primary" class="primary" @tap="register">保存</button></view> -->
     <bottom-button :isFixed="true" :bgColor="bgColor" @sendFun="addFun" text="确认保存"></bottom-button>
	</view>
</template>

<script>
import { mapState } from 'vuex';
import formRuleConfig from '@/config/formRule.config.js';
import graceChecker from '@/common/graceChecker.js';
export default {
	computed: {
		...mapState(['openId', 'customerInfo']),
		contentLength(){
			return this.content.length;
		}
	},
	data() {
		return {
			KeyboardHeight:0,
			height:400,
			id:0,
			content:'',
			len:1500,
			placeholder:"如:\n1.工作内容 \n2、任务要求；\n3、特别说明"
		}
	},
	mounted() {
		uni.onKeyboardHeightChange(res=>{
		  console.log('log',res);
		  this.KeyboardHeight = res.height
		})
	},
	onLoad(query) {
		console.log("query====",query);
		this.id=query.id;
		if(query.content && query.content!="undefined"){
			this.content=query.content;
		}
		console.log(this.id);
		// let height = uni.getSystemInfoSync().windowHeight;
		// this.height=height-uni.upx2px(420);
	},
	
	methods: {
		async register() {
			let reqBody = {"content":this.content};
			let checkRes = graceChecker.check(reqBody, formRuleConfig.regContentRule);
			if (!checkRes) {
				uni.showToast({
					title: graceChecker.error,
					icon: 'none'
				});
				return;
			}
			this.$mPage.prePage().workContent = this.content;
			uni.navigateBack({
				delta:1
			})
		},

	}
};
</script>

<style lang="scss" scoped>
.content {
	background: $bgcolor_white;
  box-sizing: border-box;
  height: 100vh;
  background: #F5F5FC;
  box-sizing: border-box;
  padding: 10rpx 30rpx;
}


.btn-row {
	position: fixed;
  bottom: 20upx;
  left: 0;
  padding: 0 30rpx;
	width: 100%;
	box-sizing: border-box;
	button {
		background-color: $main-color;
		height: 98upx;
		line-height: 98upx;
		font-size:36rpx;
	}
}

textarea{
		height: 600rpx;
		width: 100%;
		font-size: $uni-font-size-base;
	}
.r-top{
	padding:42rpx 30rpx;
	background: #FFFFFF;
  border-radius: 10rpx;
  .title{
    font-weight: bold;
font-size: 42rpx;
color: #292F44;
  }
  .des{
    font-size: 30rpx;
color: #3B4552;
line-height: 45rpx;
margin-top: 33rpx;
margin-bottom: 60rpx;
  }
}
.r-top-t{
	display: flex;
	justify-content: space-between;
	font-family:PingFang SC;
	font-weight:400;
	line-height:20px;
	color:rgba(153,153,153,1);
	opacity:1;
}
</style>
